<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>改变元素节点中的内容</title>
    </head>
    <body>
        <!-- 改变元素节点中的内容可以使用两个相关属性：
                1.innerHTML
                    innerHTML属性能以HTML语法设置节点中的内容
                2.innerText
                    innerText属性只能以纯文本的形式设置节点中的内容
        -->

        <div id="box"></div>

        <script>
            var oBox = document.getElementById('box');
            // oBox.innerHTML = 'ROC';
            oBox.innerHTML = '<ul><li>牛奶</li><li>咖啡</li></ul>';

            // oBox.innerText = 'ROC';
            // oBox.innerText = '<ul><li>牛奶</li><li>咖啡</li></ul>';
        </script>
    </body>
</html>